<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<!--[if lt IE 9]>
<script type="text/javascript" src="lib/html5.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>
<script type="text/javascript" src="lib/PIE_IE678.js"></script>
<![endif]-->
<link href="__PUBLIC__/css/H-ui.min.css" rel="stylesheet" type="text/css" />
<link href="__PUBLIC__/css/H-ui.admin.css" rel="stylesheet" type="text/css" />
<link href="__PUBLIC__/lib/icheck/icheck.css" rel="stylesheet" type="text/css" />
<link href="__PUBLIC__/lib/Hui-iconfont/1.0.6/iconfont.css" rel="stylesheet" type="text/css" />
<link href="__PUBLIC__/lib/webuploader/0.1.5/webuploader.css" rel="stylesheet" type="text/css" />
<link href="__PUBLIC__/lib/Validform/5.3.2/style.css" rel="stylesheet" type="text/css" />
<link href="__PUBLIC__/css/autoComplete.css" rel="stylesheet" type="text/css" />
<!--[if IE 6]>
<script type="text/javascript" src="http://lib.h-ui.net/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script>
<![endif]-->
<title>客户修改</title>
</head>
<body>
<div class="pd-20 mt-20">
    	<form action="" method="post" class="form form-horizontal" id="form-customer-add" autocomplete="off">
			<input type="hidden" value="{$customer.id}" name="id">
			<div class="row cl">
				<label class="form-label col-3"><span class="c-red">*</span>主要号码：</label>
				<div class="formControls col-5">
					<input type="text" class="input-text input_h" value="{$customer.tel}" placeholder="" id="tel" name="tel">
				</div>
				<div class="col-4"> </div>
			</div>
			<div class="row cl">
				<label class="form-label col-3"><span class="c-red"></span>电话号码：</label>
				<div class="formControls col-5">
					<input type="text" class="input-text input_h" value="{$customer.phone}" placeholder="" id="phone" name="phone">
				</div>
				<div class="col-4"> </div>
			</div>
			<div class="row cl">
				<label class="form-label col-3"><span class="c-red">*</span>姓名：</label>
				<div class="formControls col-5">
					<input type="text" class="input-text input_h" value="{$customer.name}" placeholder="" id="name" name="name" datatype="*" errormsg="" nullmsg="请输入房间名称">
				</div>
				<div class="col-4"> </div>
			</div>
			<div class="row cl">
				<label class="form-label col-3"><span class="c-red">*</span>性别：</label>
				<div class="formControls col-5 skin-minimal">
						<div class="radio-box display">
							<if condition="$customer['sex'] eq 'M'">
								<input type="radio" id="sex-1" name="sex" class="sex"  value="M" checked="checked">
							<else />
								<input type="radio" id="sex-1" name="sex" class="sex"  value="M">
							</if>
							<label for="sex-1">男</label>
						</div>
						<div class="radio-box display">
							<if condition="$customer['sex'] eq 'F'">
								<input type="radio" id="sex-2" name="sex" class="sex" value="F" datatype="*" nullmsg="请选择性别！" checked="checked">
							<else />
								<input type="radio" id="sex-2" name="sex" class="sex" value="F" datatype="*" nullmsg="请选择性别！">
							</if>
							<label for="sex-2">女</label>
						</div>	
				</div>
				<div class="col-4"> </div>
			</div>
		<!-- 	<div class="row cl">
				<label class="form-label col-3"><span class="c-red">*</span>地址编号：</label>
				<div class="formControls col-5">
					<input type="text" class="input-text" value="{$customer['families'][0].no}" placeholder="请输入家庭编号" id="searchName" name="name">
							<div class="sugPar">
								<div class="sug">
									<ul>
									</ul>
								</div>
							</div>
				</div>
				<div class="col-4"> </div>
			</div> -->
			
			<div class="addressCol">	
				<div class="row cl add-1">
						<label class="form-label col-3">地址：</label>
						<div class="formControls col-5">
								<input type="hidden" name="" value="" class="customerId">
								<input type="hidden" name="" value="" class="familyId">
								<input type="hidden" name="" value="" class="customerName">
								<input type="text" name="" class="addressInput input-text input_h padd_r" disabled="disabled">
						</div>
						<div class="col-3 f_r"><span class="btn btn-primary radius addEdit input_h" uid="1">编辑</span><span class="btn btn-primary radius addDel ml-10 input_h " uid="1">删除</span></div>
				</div>
				<div class="row cl add-2" style="display: none;">
						<label class="form-label col-3">地址：</label>
						<div class="formControls col-5">
								<input type="hidden" name="" value="" class="customerId">
								<input type="hidden" name="" value="" class="familyId">
								<input type="hidden" name="" value="" class="customerName">
								<input type="text" name="" class="addressInput input-text input_h" disabled="disabled">
						</div>
						<div class="col-3 f_r"><span class="btn btn-primary radius addEdit input_h" uid="2">编辑</span><span class="btn btn-primary radius addDel ml-10 input_h" uid="2">删除</span></div>
				</div>
				<div class="row cl add-3" style="display: none;">
						<label class="form-label col-3">地址：</label>
						<div class="formControls col-5">
								<input type="hidden" name="" value="" class="customerId">
								<input type="hidden" name="" value="" class="familyId">
								<input type="hidden" name="" value="" class="customerName">
								<input type="text" name="" class="addressInput input-text input_h" disabled="disabled">
						</div>
						<div class="col-3 f_r"><span class="btn btn-primary radius addEdit input_h" uid="3">编辑</span><span class="btn btn-primary radius addDel ml-10 input_h" uid="3">删除</span></div>
				</div>
				<div class="row cl add-4" style="display: none;">
						<label class="form-label col-3">地址：</label>
						<div class="formControls col-5">
								<input type="hidden" name="" value="" class="customerId">
								<input type="hidden" name="" value="" class="familyId">
								<input type="hidden" name="" value="" class="customerName">
								<input type="text" name="" class="addressInput input-text input_h" disabled="disabled">
						</div>
						<div class="col-3 f_r"><span class="btn btn-primary radius addEdit input_h" uid="4">编辑</span><span class="btn btn-primary radius addDel ml-10 input_h" uid="4">删除</span></div>
				</div>
			</div>
			<!-- 添加地址栏 -->
			<div class="row cl">
				<label class="form-label col-3">添加地址栏：</label>
				<div class="formControls col-5">
						<span class="btn btn-primary radius input_h" id="addressAddCol">添加一栏</span>
				</div>
				<div class="col-4"> </div>
			</div>
			<!-- 隐藏的模板 -->
			<div id="addressTpl" style="display: none">
				<div class="row cl">
					<label class="form-label col-3">地址：</label>
					<div class="formControls col-5">
							<input type="hidden" name="" value="" class="customerId">
							<input type="hidden" name="" value="" class="familyId">
							<input type="hidden" name="" value="" class="customerName">
							<span class="select-box mb-20">
								<select name="" class="xiaoqu select">
	                           		<option value="" selected="true" disabled="true">请选择小区</option>
	                        	</select>
							</span>
							<span class="select-box mb-20">
								<select name="" class="quyu select">
	                            	<option value="" selected="true" disabled="true">请选择区域</option>
	                        	</select>
							</span>
	                        <span class="select-box mb-20">
		                        <select name="" class="louhao select">
		                            <option value="" selected="true" disabled="true">请选择楼号</option>
		                        </select>
	                        </span>
	                       	<span class="select-box mb-20">
		                       	<select name="" class="danyuan select">
		                            <option value="" selected="true" disabled="true">请选择单元</option>
		                        </select>
	                       	</span>
	                        <span class="select-box mb-20">
		                        <select name="" class="fangjian select">
		                            <option value="" selected="true" disabled="true">请选择房间号</option>
		                        </select>
	                        </span>
	                        <span class="btn btn-primary radius addressCon">确定</span>
					</div>
					<div class="col-4"></div>
				</div>
			</div>
				<!-- 模板结束 -->
			<!-- </div> -->
			
			<div class="row cl">
				<label class="form-label col-3 text-r">客户备注：</label>
				<div class="formControls col-5">
					<textarea name="mark" cols="" rows="" class="textarea"  placeholder="100个字符以内" dragonfly="true" value="" onKeyUp="textarealength(this,100)"></textarea>
					<p class="textarea-numberbar"><em class="textarea-length">0</em>/100</p>
				</div>
				<div class="col-4"> </div>
			</div>
			<div class="row cl mt-20 mb-20">
				<div class="col-9 col-offset-3 margin_b">
					<!-- <input class="btn btn-primary radius" type="submit" value="提交"> -->
					<span class="btn btn-primary radius input_h margin_b" id="formSub">提交</span>
				</div>
			</div>
		</form>
		<div id="allmap"></div>
</div>
<!-- <script type="text/javascript" src="__PUBLIC__/lib/jquery/1.9.1/jquery.min.js"></script>  -->
<script src="//cdn.bootcss.com/jquery/1.12.4/jquery.js"></script>
<script type="text/javascript" src="__PUBLIC__/lib/icheck/jquery.icheck.min.js"></script> 
<script type="text/javascript" src="__PUBLIC__/lib/Validform/5.3.2/Validform.min.js"></script> 
<script type="text/javascript" src="__PUBLIC__/lib/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="__PUBLIC__/lib/layer/2.1/layer.js"></script> 
<script type="text/javascript" src="__PUBLIC__/js/H-ui.js"></script> 
<script type="text/javascript" src="__PUBLIC__/js/H-ui.admin.js"></script> 
<!-- <script type="text/javascript" src="Tpl/Service/common/center/edit.js"></script> -->
<script src="http://cdn.bootcss.com/jquery.form/3.51/jquery.form.min.js"></script>

<script type="text/javascript" src="__PUBLIC__/js/getUrl.js"></script> 
	<script type="text/javascript">
		// 全局
		var info={
			tel:"",//呼入用户手机号
			id:$.getUrlVar('id'),//客户ID
			customerData:'',//
			xiaoquId:0,
			quyuId:0,
			louhaoId:0,
			danyuanId:0
		}
		$(function(){
			info.tel=$.getUrlVar('tel');
			work.init();
		})

		var work={
	ddressNum:1,//地址栏个数
	dataAll:"",//总数据
	strAll:[],//初始select数据
	addressDivId:1,//当前操作地址uid
	addressCount:1,//当前地址数
	addressIndex:'',//弹窗索引
	/*·····························初始化························*/
	init:function(){
		this.addressLink();
		this.eventListen();
		if(info.tel.length==11){
			$("#tel").val(info.tel);
		}else{
			$("#phone").val(info.tel);
		}
		this.getHouse();
		this.getSelect();
		this.getCommunityData();
		// this.formsub();
	},
	/*·····························DOM························*/
	addressLink:function(){
		$.post("/index.php?m=Admin&c=Customer&a=read&id="+info.id,function(data){
			 console.log(data);
			 var familyData=data.data.families;
			 for(var i=0;i<familyData.length;i++){
			 	var k=i+1;
			 	$(".add-"+k).find(".addressInput").val(familyData[i].address);
			 	$(".add-"+k).find(".familyId").val(familyData[i].id);
			 	$(".add-"+k).find(".customerName").val(data.data.name);
			 	$(".add-"+k).show();
			 }
		});
	
	},
	eventListen:function(){
		// 表单提交
		$(document).on("click","#formSub",function(){
			work.formsub();
		});
		// 删除
		$(document).on("click",".addDel",function(){
			
				work.addressDivId=$(this).attr("uid");
				var familyId=$(".add-"+work.addressDivId).find(".familyId").val();
				var customerId=info.id;
				$.post("/index.php?m=Admin&c=FamilyMember&a=delete",{family_id:familyId,customer_id:customerId},function(data){
					if(data.stat==1){
						$(".add-"+work.addressDivId).hide();
						$(".add-"+work.addressDivId).find(".addressInput").val('');
						$(".add-"+work.addressDivId).find(".customerId").val('');
						$(".add-"+work.addressDivId).find(".customerName").val('');
						$(".add-"+work.addressDivId).find(".customerId").val('');
					}
				});
			
		})
		// 地址栏目添加
		$(document).on("click","#addressAddCol",function(){
			work.addressCount++;
			$(".add-"+work.addressCount).show();
		});
		// 地址编辑
		$(document).on("click",".addEdit",function(){
			work.addressDivId=$(this).attr("uid");
			work.addressIndex=layer.open({
				type:1,
				shade:false,
				title:false,
				area:['300px', '400px'],
				content:$("#addressTpl"),
				cancel:function(index){
				}
			});
		});
	  	//    第一级
	    $(".xiaoqu").change(function () {
	    
	//如果下一级元素有大于2个option那么就重置后续select
	        if($(".quyu").children('option').length>1){
	            $(this).nextAll().each(function(){
	                $(this).empty();
	            });
	           for(var i=0;i<work.strAll.length;i++){
	            $(this).nextAll().eq(i).html(work.strAll[i]);
	            } 
	        }
	        
	        info.xiaoquId = $(this).val();
	        console.log(info.xiaoquId);
	        if(work.strLength(work.dataAll[info.xiaoquId].data)>0){
	            var zones=work.dataAll[info.xiaoquId].data;
	            console.log(zones);
	            work.strAdd(zones,'quyu','zone');
	        }else{
	             work.msg('quyu','区域');
	             var build=work.dataAll[info.xiaoquId][0].data;
	             work.strAdd(build,'louhao');
	        }
	        
	    });
	    //    第二级
	    $(".quyu").change(function(){
	          info.quyuId = $(this).val();
	        var build=work.dataAll[info.xiaoquId]['data'][info.quyuId].data;
	        work.strAdd(build,'louhao','building');
	    });
	    //    第三级
	    $(".louhao").change(function(){
	          info.louhaoId = $(this).val();
	          var unit=work.dataAll[info.xiaoquId]['data'][info.quyuId]['data'][info.louhaoId].data;
	          console.log(unit);
	          work.strAdd(unit,'danyuan','unit');
	          for(x in unit){
	              if(unit[x]['unit_id']==0){
	                  $(".danyuan").find('option').eq(1).text('无单元');
	                  var room=work.dataAll[info.xiaoquId]['data'][info.quyuId]['data'][info.louhaoId]['data'][0].data;
	                   work.strAdd(room,'fangjian','room');
	              }
	          }
	    });
	        //    第四级
	    $(".danyuan").change(function(){
	         info.danyuanId = $(this).val();
	         if(info.danyuanId){
	             var room=work.dataAll[info.xiaoquId]['data'][info.quyuId]['data'][info.louhaoId]['data'][info.danyuanId].data;
	            work.strAdd(room,'fangjian','room');
	         }
	    });
	  	// 确定按钮
	  	$(document).on("click",".addressCon",function(){
	  		var customerId=$(".add-"+work.addressDivId).find(".customerId").val();
	  		var familyId=$(".add-"+work.addressDivId).find(".familyId").val();
	  		var customerName=$(".add-"+work.addressDivId).find(".customerName").val();
	  		var communityId=$(".xiaoqu").find("option:selected").val();
	  		var communityName=$(".xiaoqu").find("option:selected").text();
	  		var zoneId=$(".quyu").find("option:selected").val();
	  		var zoneName=$(".quyu").find("option:selected").text();
	  		var buildId=$(".louhao").find("option:selected").val();
	  		var buildName=$(".louhao").find("option:selected").text();
	  		var unitId=$(".danyuan").find("option:selected").val();
	  		var unitName=$(".danyuan").find("option:selected").text();
	  		var roomId=$(".fangjian").find("option:selected").val();
	  		var roomName=$(".fangjian").find("option:selected").text();
	  		work.addressPost(communityId,customerId,zoneId,unitId,buildId,roomId,customerName,familyId);
	  		work.addressShow(communityName,zoneName,buildName,unitName,roomName);
	  	});
			
	},
	/*·····························功能性函数························*/
	// 地址确定提交数据
	addressPost:function(communityId,customerId,zoneId,unitId,buildId,roomId,customerName,familyId){
		if(familyId){
				 $.ajax({
			        url:"/index.php?m=Admin&c=Family&a=update",
			        type:"POST",
			        data:{
			            "room_id":roomId,
			            "unit_id":unitId,
			            "building_id":buildId,
			            "zone_id":zoneId,
			            "community_id":communityId,
			            "customer_id":info.id,
			            "id":familyId,
			            "customer_name":customerName
			        },
			        error:function(){
			            console.log("服务器繁忙");
			        },
			        success:function(data,status){
						console.log(data);
			            if(data.stat==1){
			            	layer.msg("修改成功",{time:1000},function(){
			            		layer.close(work.addressIndex);
			            	}); 
			            }else{
			            	layer.msg(data.msg);
			            }
			        }
			    });
	    	}else{
	    		$.ajax({
			        url:"/index.php?m=Admin&c=Family&a=add",
			        type:"POST",
			        data:{
			            "room_id":roomId,
			            "unit_id":unitId,
			            "building_id":buildId,
			            "zone_id":zoneId,
			            "community_id":communityId,
			            "customer_id":info.id,
			            "id":familyId,
			            "customer_name":customerName
			        },
			        error:function(){
			            console.log("服务器繁忙");
			        },
			        success:function(data,status){
						console.log(data);
			           	if(data.stat==1){
			           		$(".add-"+work.addressDivId).find(".familyId").val(data.pk);
			           		layer.msg("添加成功",{time:1000},function(){
			           			layer.close(work.addressIndex);
			           		});
			           	}else{
			           		layer.msg(data.msg);
			           	}
			        }
			    });
	    	}
	    	
	},
	// 地址确定显示中文
	addressShow:function(communityName,zoneName,buildName,unitName,roomName){
		var str=communityName+zoneName+buildName+unitName+roomName;
		$(".add-"+work.addressDivId).find(".addressInput").val(str);
	},
	// 五级联动
	//获取数据并设置小区下拉
	getCommunityData:function(){
        work.dataAll=roomData.data;
        data=roomData.data;
        var str="";
        for(x in data){
            console.log(data[x]['community_name']);
            if(data[x]['community_name']){
                str+='<option value="'+data[x]['community_id']+'">'+data[x]['community_name']+'</option>';
            }
        }
        $(".xiaoqu").append(str);
	},
	// 获取初始select的值
	getSelect:function(){
		 $(".xiaoqu").nextAll().each(function(){
            work.strAll.push($(this).html());
            });
	},
	 // 计算数组或对象的长度
    strLength:function(str){
        t=typeof(str);
        if(t=='string'){
            return str.length;
        }else if(t=='object'){
            var n=0;
            for(var i in str){
                n++
            }
            return n;
        }
     },
      // 下拉菜单字符串生成
    // data为数据，id为id索引值
    strAdd:function(data,id,key){
        var str="";
        for (x in data){
            if(data[x]['unit_id']==0){
                console.log('无单元号');
                 work.msg('danyuan','单元');
                 // break;
            }
            str+='<option value="'+data[x][key+'_id']+'">'+data[x][key+'_name']+'</option>';
        }
        switch(id){
            case 'xiaoqu':
                $("."+id).empty();
                $("."+id).append('<option value="" selected="true" disabled="true">请选择小区</option>');
                break;
            case 'quyu':
                $("."+id).empty();
                $("."+id).append('<option value="" selected="true" disabled="true">请选择区域</option>');
                break;
            case 'louhao':
                $("."+id).empty();
                $("."+id).append('<option value="" selected="true" disabled="true">请选择楼号</option>');
                break;
            case 'danyuan':
                $("."+id).empty();
                $("."+id).append('<option value="" selected="true" disabled="true">请选择单元</option>');
                break;
            case 'fangjian':
                $("."+id).empty();
                $("."+id).append('<option value="" selected="true" disabled="true">请选择房间号</option>');
                break;
        }
        $("."+id).append(str);
    },
	getHouse:function(){
		if(parent.roomData){
			roomData = parent.roomData;
		}else{
			$.getJSON(
				'Public/json/2ca63cddd54f9490efad22421891a9d1.json',function(d) {
					window.roomData = d;
				}
			)
		}
	},
      // 没有下一级属性时显示的信息
    msg:function(obj,id,msg){
        $(obj).next("."+id).find("option").text('无'+msg);
    },
	/*·····························插件初始化························*/
	formsub:function(){
        $("#form-customer-add").ajaxSubmit({
	        type:'POST',
	        url:'/index.php?m=Admin&c=Customer&a=update',
	        success:function(data){
	          console.log(status);
	        	if(data.stat==1){
	              layer.msg("修改成功");
	              var index = parent.layer.getFrameIndex(window.name);
	              setTimeout(function(){
	                   parent.layer.close(index);
	              },1000);
	              // parent.location.reload();
	            parent.window.location.href="/index.php?m=Service&c=Center&a=index&tel="+info.tel;
	          }else{
	            layer.msg(data.msg);
	          }
	          }
        });
	}
}
</script>
</body>
</html>